<template>
	<view class="nav-pt">
		<view class="w-1 grent"></view>
		<!-- 自定义导航栏 -->
		<view class="w-1 mynav">
			<view class="status_bar"></view>
			<view class="w-1 p-r-30 fr-b-c m-t-30" style="height: 44px; overflow: hidden">
				<text class="c-ff bold fs-36 fm-ali nav_title">回购</text>
				<view class="fr-s-c" @tap="go_record1">
					<image src="/static/images/BuyBack/Frame29@2x.png" class="nav-right-img" mode=""></image>
					<view class="nav-right-trxt">换购记录</view>
				</view>
				<view class="fr-s-c" @tap="go_record">
					<image src="/static/images/BuyBack/Frame29@2x.png" class="nav-right-img" mode=""></image>
					<view class="nav-right-trxt">提现记录</view>
				</view>
			</view>
		</view>
		<view class="content-view">
			<view class="content-view-top">
				<view class="content-view-top_left">
					<image src="/static/images/BuyBack/Frame@2x.png" class="content-view-top-img" mode=""></image>
					<view class="">原价回购</view>
				</view>
				<view class="content-view-top_right" @tap="choose">
					{{ choose_show ? '取消' : '选择' }}
				</view>
			</view>
			<view class="content-view-list">
				<scroll-view scroll-y="true" class="scroll-view" @scrolltolower="scrolltolower">
					<view class="scroll-view-padding-bottom">
						<view class="content-view-list-item-2" v-for="(item, index) in list">
							<view style="width: 100%">
								<view class="content-view-list-item1" v-for="(items, indexs) in item.order_item">
									<image
										:src="!items.toggle ? '/static/images/BuyBack/Ellipse7@2x.png' : '/static/images/BuyBack/Group3699@2x.png'"
										class="choose_view"
										mode=""
										@tap="
											choose_active(index, indexs, items.can_withdraw, items.can_buyback, item.is_overtime, items.is_buyback, items.is_withdraw, item.state)
										"
										v-if="choose_show"
									></image>
									<view class="content-view-list-item-item">
										<view class="list-item-top">
											<view class="list-item-top-left">
												{{ item.order_no }}
											</view>
											<view class="list-item-top-right">
												{{ item.createtime_text }}
											</view>
										</view>
										<view class="list-item-min">
											<image :src="baseUrl.cdnurl + items.image" class="list-item-min-left" mode="" v-if="items.platform == 0"></image>
											<image :src="items.image" class="list-item-min-left" mode="" v-else></image>
											<view class="list-item-min-right">
												<view class="list-item-min-right-top">
													{{ items.title }}
												</view>
												<view class="list-item-min-right-bottom">
													<view class="list-item-min-right-bottom-left">
														还能卖¥
														<text class="list-item-min-right-bottom-left-text">{{ items.price }}</text>
													</view>
													<view class="list-item-min-right-bottom-right" v-show="!choose_show">
														<!--  v-if="items.withdraw == 1" -->
														<view
															class="list-item-min-right-bottom-right-left"
															@tap="go_ReplacementOfOldItems(1, items, item)"
															v-if="items.can_withdraw == 1 && item.is_overtime == 1"
														>
															商品提现
														</view>
														<view class="list-item-min-right-bottom-right-left1" v-else>不可提现</view>
														<view
															class="list-item-min-right-bottom-right-right"
															@tap="go_ReplacementOfOldItems(2, items, item)"
															v-if="items.can_buyback == 1 && item.is_overtime == 1"
														>
															一键换物
														</view>
														<view class="list-item-min-right-bottom-right-right1" v-else>一键换物</view>
													</view>
												</view>
											</view>
										</view>
										<view class="shangjia-bottom" v-if="item.state == 9">
											寄错旧件，请重新寄，待审核通后可方可使用，具体联系客服
										</view>
										<view class="shangjia-bottom" v-else-if="item.state == 10">
										    商品申请退货中，不可一键换购、一键提现
										</view>
										<view class="shangjia-bottom" v-else-if="item.is_overtime == 0">
										 过七天无理由退货后可一键换购、一键提现
										</view>
										<view class="shangjia-bottom"  v-else-if="items.is_buyback == 1 && items.can_buyback == 0 && item.is_overtime == 1 && items.can_withdraw == 1">
										 此商品已换购，不可再次换购
										</view>
										<view class="shangjia-bottom" v-else-if="items.is_withdraw == 1 && items.can_withdraw == 0 && item.is_overtime == 1 && items.can_buyback == 1">
										 此商品已提现，不可再次提现
										</view>
										<view class="shangjia-bottom"  v-else-if="items.is_buyback == 1 && items.can_buyback == 0 && item.is_overtime == 1">
										 此商品已换购，不可再次换购(提现)
										</view>
										<view class="shangjia-bottom" v-else-if="items.is_withdraw == 1 && items.can_withdraw == 0 && item.is_overtime == 1">
										 此商品已提现，不可再次提现(换购)
										</view>
										<view class="shangjia-bottom" v-else-if="item.offline_order == 1 && item.is_overtime == 1">
										 线下实体店订单，不可提现
										</view>
										<view class="shangjia-bottom" v-else-if="item.invoice_id > 0 && item.is_overtime == 1">
										 订单使用发票抵扣，不可提现
										</view>
										<view class="shangjia-bottom" v-else-if="items.is_withdraw == 0 && items.can_withdraw == 0  && item.is_overtime == 1">
										 非全款购买，不可提现
										</view>
									</view>
								</view>
							</view>
						</view>
					</view>
				</scroll-view>
			</view>
		</view>
		<view class="tc-view" v-if="choose_show">
			<view class="tc-view-left">
				已选择
				<text class="tc-view-left-bold">{{ num }}</text>
				件旧物
			</view>
			<view class="tc-view-right">
				<view class="tc-view-right-left tc-view-right-btn" @tap="go_ReplacementOfOldItems(1)">商品提现</view>
				<view class="tc-view-right-right tc-view-right-btn" @tap="go_ReplacementOfOldItems(2)">一键换物</view>
			</view>
		</view>
	</view>
</template>

<script>
import config from '@/utils/base.js';

export default {
	data() {
		return {
			choose_show: false,
			list: [],
			baseUrl: config,
			SelectedList: [],
			last_page: '',
			page: 1
		};
	},
	computed: {
		num() {
			let num = 0;
			this.SelectedList = [];
			for (let item of this.list) {
				if (item.flag == 0) {
					item.order_item.map((item1) => {
						if (item1.toggle) {
							num++;
							let data = {
								order_no: item.order_no,
								createtime_text: item.createtime_text,
								data: item1
							};
							this.SelectedList.push(data);
						}
					});
				} else {
					if (item.gifts.length > 0) {
						item.gifts.map((item1) => {
							if (item1.toggle) {
								num++;
								let data = {
									order_no: item.order_no,
									createtime_text: item.createtime_text,
									data: item1
								};
								this.SelectedList.push(data);
							}
						});
					}
				}
			}
			return num;
		}
	},
	onLoad() {
		this.getList();
	},
	onPullDownRefresh(){
		setTimeout(()=>{
			this.page = 1;
			this.list = []
			this.getList();
			uni.stopPullDownRefresh()
		},2000)
	},
	// onShow() {
		
	// },
	// onReachBottom() {
	// 	if (this.page < this.last_page) {
	// 		this.page++;
	// 		this.getList();
	// 	} else {
	// 		uni.showToast({
	// 			title: '已经到底了哦',
	// 			icon: 'none'
	// 		});
	// 	}
	// },
	methods: {
		scrolltolower(){
			if (this.page < this.last_page) {
				this.page++;
				this.getList();
			} else {
				uni.showToast({
					title: '已经到底了哦',
					icon: 'none'
				});
			}
		},
		choose() {
			this.choose_show = !this.choose_show;
		},
		choose_active(index, indexs, can_withdraw, can_buyback, is_overtime, is_buyback, state, is_withdraw) {
			if (state == 9) {
				uni.showToast({
					title: '寄错旧件，请重新寄，待审核通后可方可使用，具体联系客服',
					icon: 'none'
				});
				return false;
			}
			if (is_overtime == 0) {
				uni.showToast({
					title: '过七天无理由退货后可一键换购、一键提现',
					icon: 'none'
				});
				return false;
			}
			// if(can_buyback == 1 && is_overtime == 0){
			// 	uni.showToast({
			// 		title:'过七天无理由方可换购',
			// 		icon:'none'
			// 	})
			// 	return false
			// }
			// if(can_withdraw == 1 && is_overtime == 0){
			// 	uni.showToast({
			// 		title:'过七天无理由方可提现',
			// 		icon:'none'
			// 	})
			// 	return false
			// }
			if (can_withdraw == 0 && is_overtime == 1) {
				uni.showToast({
					title: '该商品使用了优惠方式，不可提现',
					icon: 'none'
				});
				return false;
			}
			if (is_buyback == 1 && can_buyback == 0 && is_overtime == 1) {
				uni.showToast({
					title: '此商品已换购，不可再次换购（提现）',
					icon: 'none'
				});
				return false;
			}
			if (is_withdraw == 1 && can_withdraw == 0 && is_overtime == 1) {
				uni.showToast({
					title: '此商品已提现，不可再次提现（换购）',
					icon: 'none'
				});
				return false;
			}
			this.list[index].order_item[indexs].toggle = !this.list[index].order_item[indexs].toggle;
		},
		go_ReplacementOfOldItems(num, items, item) {
			console.log(num, items, item);
			// return
			if (item) {
				console.log('进入这里了');
				if (item.order_no) {
					this.SelectedList = [];
					let data = {
						order_no: item.order_no,
						createtime_text: item.createtime_text,
						data: items,
						shop_address: item.shop.return,
						shop_id: item.shop_id
					};
					this.SelectedList.push(data);
					//OldList 旧物列表
					uni.navigateTo({
						url: `/pages/BuyBack/ReplacementOfOldItems/ReplacementOfOldItems?type=${num}&OldList=${encodeURIComponent(JSON.stringify(this.SelectedList))}`
					});
				}
			} else {
				console.log('进入else了');
				if (this.num <= 0) {
					uni.showToast({
						title: '您还未选择商品',
						icon: 'none'
					});
					return false;
				}
				this.SelectedList = [];
				console.log(this.list);
				for (let item1 of this.list) {
					for (let item2 of item1.order_item) {
						// console.log(item1)
						if (item2.toggle) {
							let data = {
								order_no: item1.order_no || '',
								createtime_text: item1.createtime_text || '',
								shop_address: item1.shop.return || '',
								shop_id: item1.shop_id || '',
								data: item2,
								fullayment: item1.fullayment
							};
							console.log(data);
							this.SelectedList.push(data);
						}
					}
				}
				console.log(this.SelectedList);
				//OldList 旧物列表
				uni.navigateTo({
					url: `/pages/BuyBack/ReplacementOfOldItems/ReplacementOfOldItems?type=${num}&&OldList=${JSON.stringify(this.SelectedList)}`
				});
			}
		},
		go_record() {
			uni.navigateTo({
				url: '/pages/BuyBack/tixianjilu/tixianjilu'
			});
		},
		go_record1() {
			uni.navigateTo({
				url: '/pages/BuyBack/record/record'
			});
		},
		tixian() {
			uni.navigateTo({
				url: '/pages/BuyBack/Withdrawal/Withdrawal'
			});
		},
		getList() {
			let t = this;
			t.$get({
				url: '/wanlshop/buyback/goods',
				data: {
					page: t.page,
					pageSize: 10,
					from: 'list'
				}
			}).then((res) => {
				if (res.code == 1) {
					if (res.data.data.length > 0) {
						res.data.data.map((item) => {
							item.order_item.map((pp) => {
								pp.toggle = false;
							});
						});
						
						t.list = [...t.list,...res.data.data,];
						t.last_page = res.data.last_page;
					}
				}
			});
		}
	}
};
</script>

<style scoped>
.grent {
	position: fixed;
	left: 0;
	top: 0;
	width: 100vw;
	height: 212rpx;
	/* background-color: #fff; */
	background-image: url('/static/images/home/Maskgroup@2x.png');
	background-repeat: no-repeat;
	background-size: 100% auto;
}

.content-view {
	width: 100%;
	height: 85vh;
	border-radius: 40rpx 40rpx 0 0;
	position: relative;
	top: 40rpx;
	background-color: #fff;
}

.mynav {
	/* background: linear-gradient(180deg, #FA360A 0%, rgba(250, 54, 10, 0) 100%); */
	background-size: 100vh, 520rpx;
	position: fixed;
	left: 0;
	top: 0;
	z-index: 99;
	overflow: hidden;
}

.nav_title {
	color: #000000;
	width: 118rpx;
	height: 42rpx;
}

.fr-s-c {
	display: flex;
	align-items: center;
}

.nav-right-img {
	width: 24rpx;
	height: 24rpx;
	margin-right: 12rpx;
}

.nav-right-text {
	font-size: 24rpx;
	font-family: Alibaba PuHuiTi 2-65 Medium, Alibaba PuHuiTi 20;
	font-weight: normal;
	color: #484d55;
}

.content-view-top {
	height: 80rpx;
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-size: 32rpx;
	color: #000;
	padding: 0 32rpx;
	box-sizing: border-box;
}

.content-view-top_left {
	display: flex;
	align-items: center;
}

.content-view-top-img {
	width: 40rpx;
	height: 40rpx;
	margin-right: 12rpx;
}

.scroll-view {
	width: 100%;
	height: 80vh;
}

.content-view-list {
	width: 100%;
}

.content-view-list-item-2 {
	width: 100%;
	display: flex;
	align-items: center;
	/* height: 226rpx; */
	border-bottom: 2rpx solid #f4f4f4;
	padding: 32rpx;
	box-sizing: border-box;
}
.content-view-list-item1 {
	width: 100%;
	display: flex;
	align-items: center;
	height: 226rpx;
	box-sizing: border-box;
}

.content-view-list-item-item {
	width: 100%;
}

.list-item-top {
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-size: 24rpx;
	font-family: Alibaba PuHuiTi 2-55 Regular, Alibaba PuHuiTi 20;
	font-weight: normal;
	color: #666666;
}

.list-item-min {
	height: 100%;
	display: flex;
	align-items: center;
	margin-top: 12rpx;
}

.list-item-min-left {
	min-width: 116rpx;
	width: 116rpx;
	height: 116rpx;
	border-radius: 12rpx;
	border: 2rpx solid #f4f4f4;
	margin-right: 20rpx;
}
.list-item-min-right {
	width: 81%;
}
.list-item-min-right-top {
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	overflow: hidden;
	/*! autoprefixer: off */
	-webkit-box-orient: vertical;
	/*! autoprefixer: on */
	word-break: break-all;
	font-size: 32rpx;
	font-family: Alibaba PuHuiTi 2-65 Medium, Alibaba PuHuiTi 20;
	font-weight: bold;
	color: #333333;
}

.list-item-min-right-bottom {
	display: flex;
	justify-content: space-between;
	margin-top: 25rpx;
}

.list-item-min-right-bottom-right {
	display: flex;
	align-items: center;
}

.list-item-min-right-bottom-left {
	font-size: 24rpx;
	font-family: Alibaba PuHuiTi 2-65 Medium, Alibaba PuHuiTi 20;
	font-weight: normal;
	color: #e32d1d;
}

.list-item-min-right-bottom-left-text {
	font-size: 32rpx;
	font-family: Alibaba PuHuiTi 2-65 Medium, Alibaba PuHuiTi 20;
	font-weight: normal;
	color: #e32d1d;
}

.list-item-min-right-bottom-right {
	font-size: 26rpx;
	font-family: Alibaba PuHuiTi 2-55 Regular, Alibaba PuHuiTi 20;
	font-weight: normal;
	color: #ffffff;
	text-align: center;
	line-height: 52rpx;
}

.list-item-min-right-bottom-right-left {
	width: 144rpx;
	height: 52rpx;
	background: linear-gradient(360deg, #e32c1c 0%, #e46c30 100%);
	border-radius: 24rpx 0rpx 0rpx 24rpx;
}
.list-item-min-right-bottom-right-left1 {
	width: 144rpx;
	height: 52rpx;
	background: #ccc;
	color: #999;
	border-radius: 24rpx 0rpx 0rpx 24rpx;
}

.list-item-min-right-bottom-right-right {
	width: 144rpx;
	height: 52rpx;
	background: linear-gradient(180deg, #4ecc81 0%, #34b806 100%);
	border-radius: 0rpx 24rpx 24rpx 0rpx;
}
.list-item-min-right-bottom-right-right1 {
	width: 144rpx;
	height: 52rpx;
	background: #ccc;
	color: #999;
	border-radius: 0rpx 24rpx 24rpx 0rpx;
}

.choose_view {
	min-width: 40rpx;
	width: 40rpx;
	height: 40rpx;
	margin-right: 20rpx;
}

.tc-view {
	position: fixed;
	bottom: 0px;
	left: 0;
	width: 100%;
	height: 96rpx;
	background: #ffffff;
	box-shadow: 0rpx -8rpx 14rpx 0rpx rgba(0, 0, 0, 0.06);
	border: 2rpx solid #f4f4f4;
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 0 20rpx;
	box-sizing: border-box;
}

.tc-view-left {
	font-size: 24rpx;
	font-family: Alibaba PuHuiTi 2-55 Regular, Alibaba PuHuiTi 20;
	font-weight: normal;
	color: #333333;
}

.tc-view-left-bold {
	color: #e32d1d;
	font-size: 48rpx;
}

.tc-view-right-btn {
	width: 152rpx;
	height: 66rpx;

	border-radius: 24rpx 24rpx 24rpx 24rpx;
	margin: 0 20rpx;
	text-align: center;
	line-height: 66rpx;
	font-size: 24rpx;
	font-family: Alibaba PuHuiTi 2-55 Regular, Alibaba PuHuiTi 20;
	font-weight: normal;
	color: #ffffff;
}

.tc-view-right {
	display: flex;
	align-items: center;
}

.tc-view-right-left {
	background: linear-gradient(360deg, #e32c1c 0%, #e46c30 100%);
}

.tc-view-right-right {
	background: linear-gradient(180deg, #4ecc81 0%, #34b806 100%);
}

.scroll-view-padding-bottom {
	padding-bottom: 100rpx;
	box-sizing: border-box;
}

.shangjia-bottom {
	font-size: 22rpx;
	font-family: Alibaba PuHuiTi 2-65 Medium, Alibaba PuHuiTi 20;
	font-weight: normal;
	color: #e56d31;
	padding: 0 10rpx;
	margin-top: 20rpx;
}

@-webkit-keyframes rubberBand11 {
	from {
		-webkit-transform: scale3d(1, 1, 1);
		transform: scale3d(1, 1, 1);
	}

	30% {
		-webkit-transform: scale3d(1.25, 0.75, 1);
		transform: scale3d(1.25, 0.75, 1);
	}

	40% {
		-webkit-transform: scale3d(0.75, 1.25, 1);
		transform: scale3d(0.75, 1.25, 1);
	}

	50% {
		-webkit-transform: scale3d(1.15, 0.85, 1);
		transform: scale3d(1.15, 0.85, 1);
	}

	65% {
		-webkit-transform: scale3d(0.95, 1.05, 1);
		transform: scale3d(0.95, 1.05, 1);
	}

	75% {
		-webkit-transform: scale3d(1.05, 0.95, 1);
		transform: scale3d(1.05, 0.95, 1);
	}

	to {
		-webkit-transform: scale3d(1, 1, 1);
		transform: scale3d(1, 1, 1);
	}
}

.rubberBand11 {
	-webkit-animation-name: rubberBand11;
	animation-name: rubberBand11;
}

.animated11 {
	-webkit-animation-duration: 2s;
	animation-duration: 2s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
	animation-iteration-count: infinite;
}
</style>
